<template>
  <div>
    <mt-swipe :auto="2000">
      <mt-swipe-item v-for="item in items" :key="item.id">
        <a :href="item.href" rel="external nofollow">
          <img :src="item.url" class="img" />
          <span class="desc"></span>
        </a>
      </mt-swipe-item>
    </mt-swipe>
  </div>
</template>
<script>
export default {
  name: "HomeSwiper",

  data() {
    return {
      items: [
        {
          url: "http://img1.qunarzz.com/sight/p0/1409/19/adca619faaab0898245dc4ec482b5722.jpg_600x330_f922b488.jpg",
        },
        {
          url: "http://img1.qunarzz.com/sight/p0/1510/3e/3e8e30a6ff5d1cb090.water.jpg_600x330_40f66364.jpg",
        },
      ],
    };
  },
};
</script>
<style scoped>
  img {
    width: 100%;
  }
  .mint-swipe {
    height: 130px;
  }
  .desc {
    font-weight: 600;
    opacity: 0.5;
    padding: 5px;
    height: 20px;
    line-height: 20px;
    width: 100%;
    color: rgb(233, 39, 39);
    /* background-color: gray; */
    position: absolute;
    bottom: 0;
  }
</style>